import React, { Component } from 'react';
import { PieChart } from '_platform/components4max/Charts/Pie';

export default class ThinPieChart extends Component {
    render() {
        return (
            <PieChart style={{ width: '100%', height: '100%' }} option={{
                tooltip: {
                    trigger: 'item',
                },
                color: ['#4caf50', '#f44336'],
                legend: {
                    top: 25,
                    left: 'right',
                    data: ['已检验', '待检验'],
                    textStyle: {
                        color: "#fff"
                    }
                },
                series: [{
                    type: 'pie',
                    //selectedMode: 'multiple',
                    clockWise: true,
                    radius: ['50%', '66%'],
                    itemStyle: {
                        normal: {
                            label: {
                                show: false
                            },
                            labelLine: {
                                show: false
                            }
                        }
                    },
                    hoverAnimation: true,

                    data: [{
                        value: 91,
                        // value: passRate[0],
                        label: {
                            normal: {
                                show: true,
                                formatter: '{d} %',
                                textStyle: {
                                    fontSize: 20,
                                    fontWeight: "bold",
                                    color: '#0580f2',
                                },
                                position: "center"
                            }
                        },
                        name: '已检验',
                        itemStyle: {
                            normal: {
                                color: { // 完成的圆环的颜色
                                    colorStops: [{
                                        offset: 0,
                                        color: '#4786ff' // 100% 处的颜色
                                    }]
                                },
                                label: {
                                    show: false
                                },
                                labelLine: {
                                    show: false
                                }
                            },
                            emphasis: {
                                //color: '#00cefc' // 鼠标悬浮上去完成的圆环的颜色
                            }
                        }
                    }, {
                        value: 9,
                        name: '待检验',
                        itemStyle: {
                            normal: {
                                color: { // 完成的圆环的颜色
                                    colorStops: [{
                                        offset: 0,
                                        color: '#D5D8DD' // 100% 处的颜色
                                    }]
                                },
                                label: {
                                    show: false
                                },
                                labelLine: {
                                    show: false
                                }
                            }
                        }
                    }]
                }]
            }
            } />
        )
    }
}